<!--
推荐type=3时，代理商的功能，BD没有
-->
<!--
推荐type=3时，代理商的功能，BD没有
-->
<template>
    <div class="order">
      <wv-tabs swipeable>
        <wv-tab title="商品订单">

            <wv-tabs type="card">
              <wv-tab  title="待确认">
                <div class="weui-panel weui-panel_access">
                 <!----> 
                 <div class="weui-panel__bd">
                  <div class="weui-media-box weui-media-box_appmsg">
                   <div class="weui-media-box__hd">
                    <img src="https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg" alt="" class="weui-media-box__thumb" />
                   </div> 
                   <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">商品1dd</h4> 
                    <p class="weui-media-box__desc">dfasdfadf</p>
                   </div>
                  </div>
                 </div> 
                </div>

                <div class="weui-panel weui-panel_access">
                 <!----> 
                 <div class="weui-panel__bd">
                  <div class="weui-media-box weui-media-box_appmsg">
                   <div class="weui-media-box__hd">
                    <img src="https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg" alt="" class="weui-media-box__thumb" />
                   </div> 
                   <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">商品ddd2</h4> 
                    <p class="weui-media-box__desc">dfasdfadf</p>
                   </div>
                  </div>
                 </div> 
                </div>
                </wv-tab>

                <wv-tab  title="已发货">
                <div class="weui-panel weui-panel_access">
                 <!----> 
                 <div class="weui-panel__bd">
                  <div class="weui-media-box weui-media-box_appmsg">
                   <div class="weui-media-box__hd">
                    <img src="https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg" alt="" class="weui-media-box__thumb" />
                   </div> 
                   <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">商dd品1</h4> 
                    <p class="weui-media-box__desc">dfasdfadf</p>
                   </div>
                  </div>
                 </div> 
                </div>

                <div class="weui-panel weui-panel_access">
                 <!----> 
                 <div class="weui-panel__bd">
                  <div class="weui-media-box weui-media-box_appmsg">
                   <div class="weui-media-box__hd">
                    <img src="https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg" alt="" class="weui-media-box__thumb" />
                   </div> 
                   <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">商品2</h4> 
                    <p class="weui-media-box__desc">dfasdfadf</p>
                   </div>
                  </div>
                 </div> 
                </div>
                </wv-tab>

                <wv-tab  title="已取消">
                <div class="weui-panel weui-panel_access">
                 <!----> 
                 <div class="weui-panel__bd">
                  <div class="weui-media-box weui-media-box_appmsg">
                   <div class="weui-media-box__hd">
                    <img src="https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg" alt="" class="weui-media-box__thumb" />
                   </div> 
                   <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">商品1</h4> 
                    <p class="weui-media-box__desc">dfasdfadf</p>
                   </div>
                  </div>
                 </div> 
                </div>

                <div class="weui-panel weui-panel_access">
                 <!----> 
                 <div class="weui-panel__bd">
                  <div class="weui-media-box weui-media-box_appmsg">
                   <div class="weui-media-box__hd">
                    <img src="https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg" alt="" class="weui-media-box__thumb" />
                   </div> 
                   <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">商品2</h4> 
                    <p class="weui-media-box__desc">dfasdfadf</p>
                   </div>
                  </div>
                 </div> 
                </div>
                </wv-tab>
            </wv-tabs>

         
          
        </wv-tab>
        <wv-tab title="洗涤订单">
            
            

            <wv-tabs type="card">
              <wv-tab title="待确认">
                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>

                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>
              </wv-tab>

              <wv-tab  title="已发货">
                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>
                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>
                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>
              </wv-tab>

              <wv-tab  title="已取消">
                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>

                <wv-panel>
                  <wv-media-box :thumb="thumb" title="商品1" description="库存：1000" to="/"></wv-media-box>
                </wv-panel>

              </wv-tab>
            </wv-tabs>
        </wv-tab>
      </wv-tabs>

      <tabbar :type="type"></tabbar>
    </div>
</template>

<script>
import info from '../info.js'
import tabbar from '../views/tabbar'

import homepic from "../../static/img/home.png"

export default {
  name: "order",
  data(){
      return{
        type: Number(this.$route.query.type),
        thumb:"https://gd4.alicdn.com/imgextra/i3/291631227/TB2R95Ue3nH8KJjSspcXXb3QFXa_!!291631227.jpg_400x400.jpg",
        description:"dfasdfadf"
      }
  },
  methods: {
    onHeaderClick(){

    }
  },
  created() {
    console.log(this.type+"====tyue")
  },
  components: {
    tabbar
  },
 
  
};
</script>


<style lang="scss">
@import '../base/reset.scss';
@import "../base/common.scss";

.order {
  .wv-tabs--line {
    .wv-tabs__wrap {
      height: pxTorem(80);
      border: 0;
    }
  }
  .weui-panel {
    margin-top:0;
    &:before {
      border-top: 0;
    }
  }
  .orderding {
    position: absolute;
    right: pxTorem(30);
    top: pxTorem(60);
    line-height: pxTorem(60);
    width: pxTorem(100);
    font-size: pxTorem(24);
    height: pxTorem(60);
    color: #1aad19;
    border: 1px solid #eeeeee;
    border-radius: pxTorem(40);
    background: none;
  }
  .weui-media-box__hd {
    margin-right: .8em;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
  }
  .weui-media-box__thumb {
    width: 100%;
    max-height: 100%;
    vertical-align: top;
  }
  .wv-tabs__content {
    margin-top: pxTorem(20);
    margin-bottom: pxTorem(100)
  }
  .wv-tab {
    font-size: pxTorem(28)
  }
  .weui-media-box__title {
    font-size: pxTorem(28)
  }
  .weui-media-box__desc {
    font-size: pxTorem(28)
  }
  .weui-panel__bd {
    text-align: left;
    .weui-media-box__thumb {
        border: 1px solid #eeeeee;
    }
  }
  
}


</style>